<template>
  <el-menu
    :default-active="activeIndex"
    :default-openeds="activeOpendsIndex"
    @open="handleOpen"
    @close="handleClose"
    background-color="#545c64"
    text-color="#fff"
    active-text-color="#ffd04b"
    :unique-opened=true>


    <el-menu-item index="7" @click="$router.push({name:'home'})">
      <i class="el-icon-s-home"></i>
      <span slot="title">首页</span>
    </el-menu-item>


<!--    <el-submenu index="1">-->
<!--      <template slot="title">-->
<!--        <i class="el-icon-menu"></i>-->
<!--        <span>系统信息管理</span>-->
<!--      </template>-->
<!--      <el-menu-item-group>-->
<!--        <el-menu-item index="1-1" @click="$router.push({name:'admin-adminMngt'})">管理员管理</el-menu-item>-->
<!--      </el-menu-item-group>-->
<!--    </el-submenu>-->

    <el-submenu index="2">
      <template slot="title">
        <i class="el-icon-s-data"></i>
        <span>老年人管理</span>
      </template>
      <el-menu-item-group>
        <el-menu-item index="2-1" @click="$router.push({name:'old-oldMngt'})">老年人信息管理</el-menu-item>
        <el-menu-item index="2-2" @click="$router.push({name:'old-oldavatar'})">老年人头像管理</el-menu-item>
        <el-menu-item index="2-3" @click="$router.push({name:'old-oldchart'})">老年人报表统计</el-menu-item>
      </el-menu-item-group>
    </el-submenu>

    <el-submenu index="3">
      <template slot="title">
        <i class="el-icon-s-data"></i>
        <span>工作人员管理</span>
      </template>
      <el-menu-item-group>
        <el-menu-item index="3-1" @click="$router.push({name:'employee-information'})">工作人员信息管理</el-menu-item>
        <el-menu-item index="3-2" @click="$router.push({name:'employee-avatar'})">工作人员头像管理</el-menu-item>
        <el-menu-item index="3-3" @click="$router.push({name:'employee-chart'})">工作人员报表统计</el-menu-item>
      </el-menu-item-group>
    </el-submenu>

    <el-submenu index="4">
      <template slot="title">
        <i class="el-icon-s-data"></i>
        <span>义工管理</span>
      </template>
      <el-menu-item-group>
        <el-menu-item index="4-1" @click="$router.push({name:'volunteer-volunteer'})">义工信息管理</el-menu-item>
        <el-menu-item index="4-2" @click="$router.push({name:'volunteer-volavatar'})">义工头像管理</el-menu-item>
        <el-menu-item index="4-3" @click="$router.push({name:'volunteer-volchart'})">义工报表统计</el-menu-item>
      </el-menu-item-group>
    </el-submenu>

    <el-submenu index="5">
      <template slot="title">
        <i class="el-icon-s-release"></i>
        <span>数据管理</span>
      </template>
      <el-menu-item-group>
        <el-menu-item index="5-1" @click="$router.push({name:'form-form'})">实时数据报表</el-menu-item>
      </el-menu-item-group>
    </el-submenu>

    <el-submenu index="6">
      <template slot="title">
        <i class="el-icon-video-camera"></i>
        <span>摄像头管理</span>
      </template>
      <el-menu-item-group>
        <el-menu-item index="6-4" @click="$router.push({name:'camera-corridor'})">走廊摄像头</el-menu-item>
        <el-menu-item index="6-1" @click="$router.push({name:'camera-room'})">房间摄像头</el-menu-item>
        <el-menu-item index="6-3" @click="$router.push({name:'camera-yard'})">庭院摄像头</el-menu-item>
        <el-menu-item index="6-5" @click="$router.push({name:'camera-table'})">桌子摄像头</el-menu-item>
      </el-menu-item-group>
    </el-submenu>

  </el-menu>
</template>

<script>
export default {
  name: "sideBar",
  props:{
    /*
    * 外部输入目前显示的页面内容
    * */
    pageIndex: {
      type: String
    },
    openIndex: {
      type: String
    }
  },
  data() {
    return{
      activeIndex: '1',
      activeOpendsIndex: ['0'],
      authorization:{
        occupa_id: ''
      }
    }
  },
  methods: {
    handleOpen(key, keyPath) {
    },
    handleClose(key, keyPath) {
    },
    goPage (url) {
      window.location.href = url
    }

  },
  created() {
    this.activeIndex = this.pageIndex;
    if (this.openIndex != '0') {
      this.activeOpendsIndex.pop();
      this.activeOpendsIndex.push(this.openIndex);
    }
   }

}
</script>
